<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app">
    <div id="top" align="right" style="width: 90%">
        <span v-if="!login.success">
            <span style="color: red;">{{login.errorMsg}}</span>
            账号：<input type="text" v-model="login.code"/>
            密码：<input type="password" v-model="login.pass"/>
            <button @click="userLogin">登陆</button>
        </span>
        <span v-else>
            欢迎,{{login.name}}的访问！
            <a href="#" @click="toCart">查看购物车</a>
            <a href="#" @click="logout">注销</a>
        </span>
    </div>
    <hr/>
    <div id="userMain">
      <span>
          姓名：{{order.user.name}},手机号：{{order.user.phone}},住址：{{order.user.address}}
      </span>
        <span>
          <label>收货人信息：</label>
          <span v-if="order.user.flagAddress">
              <ol>
                <li v-for="a in order.user.address_list">
                  <input type="radio" name="address" :value="a.id" v-model="order.shouhuoren.id"/>
                  姓名：{{a.contact}}，地址：{{a.addressDesc}}，手机号：{{a.tel}}
                </li>
              </ol>
          </span>
          <span>
              收货人姓名：<input type="text" v-model="order.shouhuoren.contact"/>
              地址：<input type="text" v-model="order.shouhuoren.addressDesc"/>
              邮编：<input type="text" v-model="order.shouhuoren.postCode"/>
              电话：<input type="text" v-model="order.shouhuoren.tel"/>
              <button @click="saveAddress">添加收货人</button>
          </span>
      </span>
    </div>
    <hr/>
    <div id="cartMain">
        <table width="80%" align="center">
            <caption><a href="index.html">返回</a></caption>
            <tr>
                <th>序号</th>
                <th>商品名称</th>
                <th>单价</th>
                <th>数量</th>
                <th>价格</th>
            </tr>
            <tr v-for="(g,i) in carts">
                <th>{{i + 1}}</th>
                <th>{{g.goods.data.goodsName}}</th>
                <th>¥{{g.goods.data.goodsPrice}}元</th>
                <th>
                    {{g.num}}
                    {{g.goods.data.goodsUnit}}
                </th>
                <th>¥{{g.num * (g.goods.data.goodsPrice - 0)}}元</th>
            </tr>
            <tr>
                <td colspan="5" align="right">
                    <b>总价：¥{{totalPrice}}元</b>
                    <button @click="pay">支付</button>
                </td>
            </tr>
        </table>
    </div>
</div>
</body>
</html>
<script src="../js/vue.min.js"></script>
<script src="../js/axios.min.js"></script>
<script src="../js/vue.before.index.js"></script>